<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>管理员登陆</title>
</head>
<head>
    <meta charset="UTF-8">
    <title>Adnim Login</title>
</head>
<style>
    html{
        width: 100%;
        height: 100%;
        overflow: hidden;
        font-family: sans-serif;
    }
    body{
        width: 100%;
        height: 100%;
        font-family: 'Open Sans',sans-serif;
        margin: 0;
        background-color: #5A5A5A;
    }
    #admin_login{
        position: absolute;
        top: 50%;
        left:50%;
        margin: -150px 0 0 -150px;
        width: 300px;
        height: 300px;
    }
    #admin_login h1{
        color: #fff;
        text-shadow:0 0 10px;
        letter-spacing: 1px;
        text-align: center;
    }
    h1{
        font-size: 2em;
        margin: 0.67em 0;
    }
    input{
        width: 300px;
        height: 35px;
        margin-bottom: 10px;
        outline: none;
        padding: 10px;
        font-size: 13px;
        color: #fff;
        text-shadow:1px 1px 1px;
        border-top: 1px solid #312E3D;
        border-left: 1px solid #312E3D;
        border-right: 1px solid #312E3D;
        border-bottom: 1px solid #56536A;
        border-radius: 4px;
        background-color: #2D2D3F;
    }
    .but{
        width: 300px;
        min-height: 20px;
        display: block;
        background-color: #4a77d4;
        border: 1px solid #3762bc;
        color: #fff;
        padding: 9px 14px;
        font-size: 15px;
        line-height: normal;
        border-radius: 5px;
        margin: 0;
    }
    .titlename{
        color: #fff;
        text-shadow:0 0 10px;
        letter-spacing: 1px;
        text-align: left;
        margin-left:0px;
    }
    #errorMsg{
        color: #CC0000;
        text-shadow:0 0 10px;
        letter-spacing: 1px;
        text-align: left;
        margin-left:0px;
    }
</style>
<script src="${pageContext.request.contextPath}/static/js/jquery-1.11.0.min.js"></script>
<script>
    $(function (){
        $("#login_btn").click(function (){
            $.post("admin/adminLogin",$("#adminLoginForm").serialize(),function (data){
                if(data.flag){
                    location.href = "${pageContext.request.contextPath}/admin/animationAdmin";
                }else {
                    $("#errorMsg").html(data.errorMsg);
                }
            });
            return false;
        });
    });
</script>
<body>
<div id="admin_login">
    <h1>花瓣动漫管理员登陆</h1>
    <label id="errorMsg" class="titlename"></label>
    <form id="adminLoginForm" class="form-signin" action="" method="post">
        <label for="username"  class="sr-only titlename">管理员账号</label></br>
        <input type="text" name="username" id="username" class="form-control" placeholder="Please Enter Username" required autofocus></br>
        <label for="password"  class="sr-only titlename">密码</label></br>
        <input type="password"  name="password" id="password" class="form-control" placeholder="Please Enter Password" required></br>
        <button class="btn btn-lg btn-primary btn-block but" type="submit" id="login_btn">立即登陆</button>
    </form>
</div>
</body>
</html>
